<template>
  <el-card class="box-card">
    <XForm ref="form" :fieldList="fieldList" :options="formOption" :formData="info.intelligent_stocking" :originOption="originOption">
      <template #LT>
        <span class="ml-[-100px]">基础LT天数 - </span>
        <el-input v-model="info.intelligent_stocking.replenishment_days" placeholder="请输入" style="width: 100px" class="mx-[4px]" />

        {{ "< " }}可售天数时，系统自动设置<span class="text-[red]">不补货</span>，系统定时检测！
      </template>
    </XForm>
    <div>说明：当可售天数 {{ "<" }} 基础LT天数时，系统认定为对应SKU需要补货，当前规则可过滤少量缺货的SKU。</div>
    <div class="mt-[8px] pl-[100px]">
      <div v-for="(item, key) in info.intelligent_stocking?.stocking_days_config" :key="key" class="flex items-center mb-[8px] w-[100%]">
        <el-input-number v-model="item.sales_days" :precision="0" :min="0" :controls="false" class="w-[60px]" />
        天销量区间在
        <el-select v-model="item.condition" placeholder="请选择" style="width: 100px" class="h-[32px] mx-[8px]">
          <el-option label="> (大于)" value=">" />
          <el-option label="< (小于)" value="<" />
        </el-select>
        <el-input-number v-model="item.sales_num" :precision="0" :min="0" :controls="false" class="w-[60px]" />
        ，备货频率为
        <el-input-number v-model="item.stocking_frequency" :precision="0" :min="0" :controls="false" class="w-[60px]" />
        天一次，每次备
        <el-input-number v-model="item.stocking_days" :precision="0" :min="0" :controls="false" class="w-[60px]" />
        天库存。

        <div @click="add" class="dk-iconfont icon-CirclePlus cursor-pointer"></div>
        <div v-if="key != 0" @click="dtl(key)" class="dk-iconfont icon-CircleMinus ml-2 cursor-pointer"></div>
      </div>
    </div>
  </el-card>
</template>

<script setup>
import { predictSalesEnum } from "@/api/base"
import XForm from "@/components/XForm/index.vue"
import FormItem from "@/components/XForm/FormItem.vue"

const props = defineProps({
  info: { type: Object, default: () => {} },
})
//获取下拉数据
onMounted(() => {})
const add = () => {
  props.info.intelligent_stocking?.stocking_days_config.push({ departments: [], area: "" })
}
const dtl = (idx) => {
  props.info.intelligent_stocking?.stocking_days_config.splice(idx, 1)
}

const form = ref()
const originOption = ref({})
const formOption = ref({
  labelWidth: "200px",
})

const publicStyle = { style: { width: "300px" } }
const fieldList = ref([
  { type: "title", label: "智能补货配置" },
  { slot: "LT" },
  {
    field: "asin_status",
    label: "设置<span class='text-[red]'>不补货</span>的ASIN状态：",
    type: "checkbox",
    options: {
      data: [
        { label: "新品", value: "1" },
        { label: "正常", value: "2" },
        { label: "重点", value: "3" },
        { label: "清库", value: "4" },
      ],
    },
  },
  {
    field: "sku_status",
    label: "设置<span class='text-[red]'>不补货</span>的SKU状态：",
    type: "checkbox",
    options: {
      data: [
        { label: "在售", value: "1" },
        { label: "呆滞", value: "2" },
        { label: "清库", value: "3" },
        { label: "停售", value: "4" },
      ],
    },
  },
  {
    field: "sku_supply_status",
    label: "设置<span class='text-[red]'>不补货</span>的SKU货源状态：",
    type: "checkbox",
    options: {
      data: [
        { label: "正常", value: "1" },
        { label: "缺货", value: "2" },
        { label: "断货", value: "3" },
        { label: "停产", value: "4" },
      ],
    },
  },
])
defineExpose({ form })
</script>
<style lang="scss" scoped></style>
